<template>
    <div class="app-container">
      <h4>用户信息</h4>
      <table
        class="table table-striped table-condenseda table-bordered"
        width="100%"
      >
        <tbody>
          <tr>
            <th width="15%">手机号</th>
            <td width="35%"><b>{{ userInfo.phone }}</b></td>
            <th width="15%">用户姓名</th>
            <td width="35%">{{ userInfo.name }}</td>
          </tr>
          <tr>
            <th>状态</th>
            <td>{{ userInfo.status == 0 ? '锁定' : '正常' }}</td>
            <th>注册时间</th>
            <td>{{ userInfo.createTime }}</td>
          </tr>
        </tbody>
      </table>
  
      <h4>认证信息</h4>
      <table
        class="table table-striped table-condenseda table-bordered"
        width="100%"
      >
        <tbody>
          <tr>
            <th width="15%">姓名</th>
            <td width="35%"><b>{{ userInfo.name }}</b></td>
            <th width="15%">证件类型</th>
            <td width="35%">{{ userInfo.certificatesType }}</td>
          </tr>
          <tr>
            <th>证件号</th>
            <td>{{ userInfo.certificatesNo }}</td>
            <th>证件图片</th>
            <td><img
                :src="userInfo.certificatesUrl"
                width="80px"
              ></td>
          </tr>
        </tbody>
      </table>
  
      <h4>就诊人信息</h4>
      <el-table
        :data="patientList"
        stripe
        style="width: 100%"
      >
  
        <el-table-column
          label="序号"
          width="70"
          align="center"
        >
          <template slot-scope="scope">
            {{ scope.$index + 1 }}
          </template>
        </el-table-column>
  
        <el-table-column
          prop="name"
          label="姓名"
        />
        <el-table-column
          prop="param.certificatesTypeString"
          label="证件类型"
        />
        <el-table-column
          prop="certificatesNo"
          label="证件编号"
        />
        <el-table-column label="性别">
          <template slot-scope="scope">
            {{ scope.row.sex == 1 ? '男' : '女' }}
          </template>
        </el-table-column>
        <el-table-column
          prop="birthdate"
          label="出生年月"
        />
        <el-table-column
          prop="phone"
          label="手机"
        />
        <el-table-column label="是否结婚">
          <template slot-scope="scope">
            {{ scope.row.isMarry == 1 ? '时' : '否' }}
          </template>
        </el-table-column>
        <el-table-column
          prop="param.fullAddress"
          label="地址"
        />
        <el-table-column
          prop="createTime"
          label="注册时间"
        />
      </el-table>
  
      <br>
      <el-row>
        <el-button @click="back">返回</el-button>
      </el-row>
    </div>
  </template>
  <script>
  import userInfoApi from '@/api/yygh/userInfo'
  export default {
    // 定义数据
    data() {
      return {
        id: this.$route.params.id,
        userInfo: {}, // 会员信息
        patientList: [] // 就诊人列表
      }
    },
  
    // 当页面加载时获取数据
    created() {
      this.fetchDataById()
    },
  
    methods: {
      // 根据id查询会员记录
      fetchDataById() {
        userInfoApi.show(this.id).then(response => {
          this.userInfo = response.data.userInfo
          this.patientList = response.data.patientList
        })
      },
  
      back() {
        window.history.back(-1)
      }
    }
  }
  </script>
  